<!DOCTYPE html>
<!--根据BCP47文档规范, 声明语言为大陆简中普通话-->
<html lang="zh-cmn-Hans-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="./css/style.css">
    <title>Huffman编码及解码</title>
</head>
<body>
    <header>
        <nav class="navbar" style="background-color: #e3f2fd;">
            <div class="container">
                <a class="navbar-brand text-info" href="huffman.html">Huffman编码及解码</a>
            </div>
        </nav>
    </header>

    <main>
        <div class="container">
            <form onsubmit="return false;">
                <div class="form-group">
                    <label for="words">请输入一句话:</label>
                    <div class="input-group">
                        <input type="text" class="form-control" id="words">
                        <div class="input-group-append">
                            <button type="button" class="btn btn-primary" id="encode_words" disabled>运行编码</button>
                            <button type="button" class="btn btn-primary" id="decode_words" disabled>运行解码</button>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="input-group">
                        <div class="custom-file">
                            <input type="file" class="custom-file-input" accept=".txt" id="file_e">
                            <label class="custom-file-label" for="file_e" id="file_label_e">
                                上传.txt文件
                            </label>
                        </div>
                        <div class="input-group-append">
                            <button type="button" class="btn btn-primary" id="encode_file" disabled>运行编码</button>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="input-group">
                        <div class="custom-file">
                            <input type="file" class="custom-file-input" accept=".hc" id="file_d">
                            <label class="custom-file-label" for="file_d" id="file_label_d">
                                上传刚才生成的encode.hc文件
                            </label>
                        </div>
                        <div class="input-group-append">
                            <button type="button" class="btn btn-primary" id="decode_file" disabled>运行解码</button>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label for="result">运行结果:</label>
                    <textarea class="form-control" id="result" readonly></textarea>
                </div>
            </form>
        </div>
    </main>

    <footer class="bg-light">
        <div class="container">
            <nav class="nav">
                <a class="nav-link text-secondary">
                    © 2019 周淦清 计科11704 201703407
                </a>
            </nav>
        </div>
    </footer>

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script type="text/javascript" src="./js/jquery.min.js" charset="UTF-8"></script>
    <!-- Custom JavaScript -->
    <script type="text/javascript" src="./js/huffman.js" charset="UTF-8"></script>
</body>
</html>